The second approach to use style sheet is the Embedded style sheets into HTML5 documents.
In CSS, styles which are commenly placed within a style element use selectors to put on style elements. The MIME type of the style sheet is specicfied by the style element type attribute. text/css is used in CSS style sheets. This table shows the most common MIME types used in CSS.
The CSS rules for the style sheet are defined in the style sheet's body. To be able to separate the HTML5 from CSS3 code, a CSS selector is used to clearly indicate the content that will be formatted based on a rule. The body of a rule within a style sheet is always delimited by the curly braces ({ }).
A dot (.) always precedes declration of a style-class. It helps to define any style which in turn can be applied to HTML5 content. These concepts are shown in detail in the next example.
Any style defined by the author takes precedence over styles defined by the user, and also user over user agent. Styles declared for parent elements are inherited by child elemenet. See for example, the child em inherits from its parent. The rendered code on the browser is viewed and the code is accesible here.
Declaring id selectors is another style in CSS. It's possible to have an element in a page that has an id, and then declare a selector as #elementId to use the element's style. The z-index property allows absolute positioning to control for example whether to put a text in the foreground/background of the picture. An example demonstrating this concept and other CSS are illustrated in this HTML5 document . The output of this HTML5 is shown here .